<html>
	<title>
		Thermal stuff calculator
	</title>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
	<body>
		<td>
		<table id="console">
			<tr id="optionalTC">
				<td>Heatsink TC:</td>
				<td><input type="number" id="heat_sink_tc" class="hsparam" value="100">						</td>
				<td>W/mK</td>
			</tr>
			<tr>
				<td>Length</td>
				<td><input type="number" id="length" class="hsparam" value="100"> 						</td>
				<td>mm<sup></sup></td>
			</tr>
			<tr>
				<td>Width</td>
				<td><input type="number" id="width" class="hsparam" value="100"> 						</td>
				<td>mm<sup></sup></td>
			</tr>
			<tr>
				<td>Die Attach Thickness:</td>
				<td><input type="number" id="die_attach_thickness" class="hsparam" value="100"> 			</td>
				<td>mm</td>
			</tr>
			<tr>
				<td>Die Attach Thermal Conductivity:</td>
				<td><input type="number" id="die_attach_thermal_conductivity" class="hsparam" value="100">	</td>
				<td>W/mK</td>
			</tr>
			<tr><td><br></td><td><br></td></tr>
			<!--<tr>
				<td>Heatsink Length:</td>
				<td><input type="number" id="heat_sink_length" class="hsparam" value="100">					</td>
				<td>mm</td>
			</tr>
			<tr>
				<td>Heatsink Width:</td>
				<td><input type="number" id="heat_sink_width" class="hsparam" value="100">					</td>
				<td>mm</td>
			</tr>-->
			<tr><td><br></td><td><br></td></tr>
			<tr>
				<td>Heatsink Thickness:</td>
				<td><input type="number" id="heat_sink_thickness" class="hsparam" value="100">				</td>
				<td>mm</td>
			</tr>
			<tr>
				<td>Case Temperature:</td>
				<td><input type="number" id="case_temperature" class="hsparam" value="100">					</td>
				<td>&deg;C</td>
			</tr>
			<tr>
				<td>Power Dissipated:</td>
				<td><input type="number" id="power_dissipated" class="hsparam" value="100">					</td>
				<td>W</td>
			</tr>
			<tr><td><br></td><td><br></td></tr>
			<tr>
				<td>Significant Figures:</td>
				<td><input type="number" id="sigfigs" class="hsparam" value="8">					</td>
				<td></td>
			</tr>
			<tr><td><br></td><td><br></td></tr>
			<tr><td><br></td><td><br></td></tr>
			<tr>
				<td>
					<!--<button><strong>Calculate junction temperature</strong></button>-->
					<strong>Junction Temperature</strong>
				</td>
				<td>
					<strong>
						<div id="result"></div>
					</strong>
				</td>
				<td><strong>&deg;C</strong></td>
			</tr>
		</table>
		</td>
		<td>
		<!--<canvas id="layers" width="400" height="600">
		Doesn't work.
		</canvas>-->
		
			<table id="drawingtable">
				<tr>
					<td>
						Heat Source
					</td>
				</tr>	
				
				<tr>
					<td id="layer1">
						Layer 1
							<div id="hsoption
							<select id="heat_sink_material" class="hsparam">
								<option>CVD Diamond</option>
								<option>Cu</option>
								<option>Au</option>
								<option>Cu/Mo70Cu/Cu 1:4:1</option>
								<option>SiC</option>
								<option>BeO</option>
								<option>Mo/Cu 50/50</option>
								<option>Mo/Cu 60/40</option>
								<option>Cu/Mo/Cu 1:1:1</option>
								<option>Al</option>
								<option>W/Cu 75/25</option>
								<option>Cu/Mo/Cu 1:2:1</option>
								<option>W/Cu 80/20</option>
								<option>AlN</option>
								<option>W/Cu 85/15</option>
								<option>Mo/Cu 70/30</option>
								<option>Cu/Mo/Cu 1:3:1</option>
								<option>W/Cu 90/10</option>
								<option>Cu/Mo/Cu 1:4:1</option>
								<option>Al-SiC</option>
								<option>Cu/Mo/Cu 13:74:13</option>
								<option>W</option>
								<option>Si</option>
								<option>Mo</option>
								<option>Ni</option>
								<option>InP</option>
								<option>Sn</option>
								<option>GaAs</option>
								<option>99.6% Al2O3</option>
								<option>96% Al2O3</option>
								<option>Alloy 42</option>
								<option>Custom</option>
							</select>
					</td>
				</tr>	
				
				<tr>
					<td id="layer2">
						Layer 2
						<script>
						$("#layer2").append($("#heat_sink_material").clone());
						</script>
					</td>
				</tr>	
				
				<tr>	
					<td id="layer3">
						Layer 3
					</td>
				</tr>	
				
				<tr>	
					<td id="layer4">
						Layer 4
					</td>
				</tr>	
				
				<tr>	
					<td id="layer5">
						Layer 5
					</td>
				</tr>	
				
				<tr>	
					<td id="layer6">
						Layer 6
					</td>
				</tr>
			</table>		
		</td>
	
	</body>

	<script>
	//$("#console").css("border-right","solid").css("border-width","1px");
	$("#drawingtable").css("margin-left","auto").css("margin-right","auto").css("text-align","center");
	</script>
	
	
	<script>	
	var matconmap = {"CVD Diamond" : 1000,
						"Cu" : 390,
						"Au" : 300,
						"Cu/Mo70Cu/Cu 1:4:1" : 300,
						"SiC" : 200,
						"BeO" : 280,
						"Mo/Cu 50/50" : 230,
						"Mo/Cu 60/40" : 210,
						"Cu/Mo/Cu 1:1:1" : 250,
						"Al" : 240,
						"W/Cu 75/25" : 220,
						"Cu/Mo/Cu 1:2:1" : 210 ,
						"W/Cu 80/20" : 200,
						"AlN" : 170,
						"W/Cu 85/15" : 190,
						"Mo/Cu 70/30" : 170,
						"Cu/Mo/Cu 1:3:1" : 190,
						"W/Cu 90/10" : 180,
						"Cu/Mo/Cu 1:4:1" : 180,
						"Al-SiC" : 160,
						"Cu/Mo/Cu 13:74:13" : 170,
						"W" : 165,
						"Si" : 150,
						"Mo" : 140,
						"Ni" : 90,
						"InP" : 68,
						"Sn" : 65,
						"GaAs" : 45,
						"99.6% Al2O3" : 30,
						"96% Al2O3" : 24,
						"Alloy 42" : 16};
	
	
	var $tc = $("#optionalTC");
	var $mat = $("#heat_sink_material");
	
	$tc.hide();
	
	$mat.change(function(){
		if (this.value === "Custom")
			$tc.show();
		else
			$tc.hide();
	});
	
	function getTC(){
		if ($mat.val() === "Custom")
			return +$tc.val();
		else
			return matconmap[$mat.val()];
	}
	
	function getArea(){
		return +$("#length").val() * +$("#width").val();
	}
	
	</script>
	
	<script>
		function calcTemp(hsTC, hsArea, hsThick, dieThick, dieTC, dieArea, caseTemp, power){
			return 6.14 - 0.0131 * hsTC + 0.00157 * hsArea + 0.995 * hsThick + 23.1 * dieThick - 0.239 * dieTC - 0.0263 * dieArea + 1.00 * caseTemp + 0.0837 * power;
		}
		function updateCalc(){
			var $result = $("#result");
			/*var val = 6.14 
					- 0.0131	* getTC()
					+ 0.00157 	* getArea()
					+ 0.995		* +$("#heat_sink_thickness").val()
					+ 23.1		* +$("#die_attach_thickness").val()
					- 0.239		* +$("#die_attach_thermal_conductivity").val()
					- 0.0263	* getArea()
					+ 1.00		* +$("#case_temperature").val()
					+ 0.0837	* +$("#power_dissipated").val();*/
			var val = calcTemp(getTC(), getArea(), +$("#heat_sink_thickness").val(), +$("#die_attach_thickness").val(), +$("#die_attach_thermal_conductivity").val(), getArea(), +$("#case_temperature").val(), +$("#power_dissipated").val());
			$result.text(val.toPrecision(+$("#sigfigs").val()));
			if (val >= 105) {
				$result.css("color", "red");
			} else {
				$result.css("color", "green");
			}
		}
	</script>
	
	<script>
		function update(){
			updateCalc();
		}
		$(".hsparam").change(update);
		updateCalc();
	</script>
	
	
	<!--<script>
	var example = document.getElementById('layers');
	var context = example.getContext('2d');
	context.fillStyle = 'red';
	context.fillRect(0, 500, 400, 600);
	</script>-->
	
	<div align="right">
		<a rel="license" href="https://creativecommons.org/licenses/by-sa/4.0/"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by-sa/4.0/88x31.png" /></a>
	</div>
</html>